//
// Pagination
// --------------------------------------------------

@pagination-item-height: 22px;
@pagination-btn-width: 20px;

.pagination {

    .pages {
        display: inline-block;
    }

    a {
        display: inline-block;
        min-width: @pagination-item-height;
        height: @pagination-item-height;
        line-height: @pagination-item-height;
        padding: 0 4px;
        margin: 0 2px;
        text-align: center;
        border-radius: @border-radius-base;
        color: @text-color-base;
        letter-spacing: -0.5px;
        cursor: pointer;
        .user-select(none);

        &:hover {
            background-color: @menu-hover-bg;
            text-decoration: none;
        }

        &.active {
            background-color: @primary-color;
            color: #fff;
        }

        > i {
            color: @icon-color-default;
            font-size: @font-size-base + 2;
        }
        
        &.disabled, 
        &.disabled > i {
            background-color: transparent;
            color: @text-color-disabled;
            cursor: default;
        }
    }

    .first,
    .last,
    .pre,
    .next {
        width: @pagination-btn-width;
        min-width: @pagination-btn-width;
        margin: 0;
    }

    .sizer {
        width: 70px;
        margin-left: 10px;
    }

    .mui-select-trigger {
        height: auto;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .mui-select-options li {
        height: 25px;
        line-height: 25px;
    }

    .quick {
        display: inline-block;
        margin-left: 10px;
    }

    .quick-input {
        width: 44px;
        height: auto;
        margin: 0 5px;
        padding: 2px 5px;
    }
}